import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:flutter_base_app/config/app_colors.dart';
import 'package:flutter_base_app/config/i18n/i18n.dart';

import '../../config/theme.dart';
import '../image/svg_widget.dart';

class MenuItemData {
  final int index;
  final String labelId;
  final String icon;

  MenuItemData(this.index, this.labelId, this.icon);
}

class MenuWidget extends StatelessWidget {
  final List<MenuItemData> items;
  final Function(MenuItemData) onTabChange;
  final double spacing;
  final double fontSize;
  final double iconSize;
  final double itemHeight;

  final Rx<int> _currentIndex;

  MenuWidget({
    super.key,
    required this.items,
    int? current,
    this.spacing = 20,
    this.fontSize = 18,
    this.iconSize = 24,
    this.itemHeight = 40,
    required this.onTabChange,
  }) : _currentIndex = (current ?? items.first.index).obs;

  final _leftMenuHoverItem = (-1).obs;

  @override
  Widget build(BuildContext context) {
    return Column(spacing: spacing, children: [
      for (var p in items) Obx(() => _buildCustomDestination(context, p)),
    ]);
  }

  /// 自定义菜单项
  Widget _buildCustomDestination(BuildContext context, MenuItemData data) {
    final primaryColorAlpha = context.theme.primaryColor.withValues(alpha: context.isDark ? 0.2 : 0.1);
    final isSelect = _currentIndex.value == data.index;
    final color = isSelect ? primaryColorAlpha : ColorsApp.black;
    final iconColor = isSelect ? primaryColor : ColorsApp.black;

    return Material(
      borderRadius: BorderRadius.circular(10), // 匹配 BoxDecoration 的圆角半径
      color: isSelect
          ? color
          : _leftMenuHoverItem.value == data.index
              ? primaryColorAlpha
              : Colors.transparent, // 设置 Material 的背景色
      child: InkWell(
        onTap: () {
          onTabChange(data);
          _currentIndex.value = data.index;
        },
        splashColor: primaryColorAlpha,
        hoverColor: Colors.transparent,
        onHover: (hover) {
          _leftMenuHoverItem.value = hover ? data.index : -1;
        },
        child: SizedBox(
          width: double.infinity,
          height: itemHeight,
          // padding: const EdgeInsets.symmetric(vertical: 16),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              SizedBox.fromSize(size: const Size(24, 0)),
              SizedBox(
                width: iconSize,
                height: iconSize,
                child: SvgWidget(
                  data.icon,
                  colorFilter: iconColor.toColorFilter(),
                ),
              ),
              SizedBox.fromSize(size: const Size(16, 0)),
              Text(
                data.labelId.trx,
                style: TextStyle(
                  fontSize: fontSize,
                  color: iconColor,
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
